<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=980">
<title>Html 5 - Home Page</title>
<link rel="stylesheet" type="text/css" href="styles/base.css"/>
<link rel="stylesheet" type="text/css" href="styles/global.css"/>
<link rel="stylesheet" type="text/css" href="styles/home.css"/>
<link rel="stylesheet" id='style-css' type="text/css" href="styles/diapo.css" media="all">
<!--[if lt IE 9]>
<script src="scripts/html5shiv.js" type="text/javascript"></script>
<![endif]-->
</head>
<body>
<div class="header-wrapper">
	<header id="site-header" class="layout">
		<section  id="site-logo"><a href="###" title="Site Name" rel="home"><span>Site Name</span></a></section >
		<hgroup class="dn">
			<h1 id="site-title">Site Name</h1>
			<h2 id="site-description">重新上路</h2>
		</hgroup>
		<nav id="secondary-nav" role="navigation">
			<ul class="clearfix">
				<li class="link"><a href="###">Nav 1</a></li>
				<li class="link"><a href="###">Nav 2</a></li>
				<li class="link "><a href="###">Nav 3</a></li>
			</ul>
		</nav>
		<form method="get" id="search-form" action="http://www.elppa.cn/">
			<label for="s" class="assistive-text">Search</label>
			<input type="text" class="field" name="s" id="s" placeholder="Search" />
			<input type="submit" class="submit" name="submit" id="searchsubmit" value="Search" />
		</form>
		<nav id="primary-nav" role="navigation">
			<ul class="list clearfix">
				<li class="link"><a href="###">Nav 1</a></li>
				<li class="link"><a href="###">Nav 2</a></li>
				<li class="link"><a href="###">Nav 3</a></li>
				<li class="link"><a href="###">Nav 4</a></li>
				<li class="link"><a href="###">Nav 5</a></li>
				<li class="link"><a href="###">Nav 6</a></li>
				<li class="link"><a href="###">Nav 7</a></li>
				<li class="link"><a href="###">Nav 8</a></li>
			</ul>
		</nav>
	</header>
	<div class="header-background">
	</div>
</div>
<div class="main-wrapper layout">
	<div id="site-main" class="r5 pt20 clearfix">
		<section class="home-slide">
			<div style="overflow:hidden; width:960px; margin: 0 auto 20px auto; ">
				<div class="pix_diapo">
					<div data-thumb="images/cms/demo1_thumb.jpg"> <img src="images/cms/demo1.jpg" alt="" />
						<div class="caption elemHover fromLeft">This photo was taken while exploring the wilds outside of Kyoto a few weeks ago. </div>
					</div>
					<div data-thumb="images/cms/demo2_thumb.jpg"> <img src="images/cms/demo2.jpg" alt="" />
						<div class="caption elemHover fromLeft">This giclée print delivers a vivid image with maximum color accuracy and exceptional resolution. </div>
					</div>
				</div>
			</div>
		</section>
		<div class="home-item r5 clearfix">
			<section class="home-news rl5 fl">
				<header class="home-news-title">ProSite</header>
				<div class="home-news-sub"> <img src="images/cms/99_book.jpg" width="287" height="135" />
					<p>Personal Portfolio Sites that sync with the Behance Network.Personal Portfolio</p>
				</div>
				<dl class="home-news-list">
					<dd><a href="###">A simple and powerful site builder</a></dd>
					<dd><a href="###">Endless options for customization</a></dd>
					<dd><a href="###">No programming required</a></dd>
					<dd><a href="###">No Behance branding. No ads.</a></dd>
					<dd><a href="###">Use your own domain name</a></dd>
					<dd><a href="###">Just one place to maintain your work</a></dd>
					<dd><a href="###">Unddmited multimedia projecs</a></dd>
				</dl>
				<footer class="home-footer-more"><a href="###" class="r3"><span class="ico-text">More</span><span class="ico-more"></span></a></footer>
			</section>
			<section class="home-product fl">
				<header class="home-product-title">Product<span class="home-header-more"><a href="###">More</a></span></header>
				<ul class="home-product-list clearfix">
					<li class="post">
						<article class="post-item J-item-cover r5">
							<div class="post-pic"><a href="###" class="J-cover-img"><img class="rt3" src="images/cms/299d39e776aafe6db7724b9c35a16807.jpg" /></a></div>
							<h1 class="post-title"><a href="###">p1</a></h1>
						</article>
					</li>
					<li class="post">
						<article class="post-item J-item-cover r5">
							<div class="post-pic"><a href="###" class="J-cover-img"><img class="rt3" src="images/cms/547aef4f92296167a861181bd91d2f6a.jpg" /></a></div>
							<h1 class="post-title"><a href="###">p2</a></h1>
						</article>
					</li>
					<li class="post last">
						<article class="post-item J-item-cover r5">
							<div class="post-pic"><a href="###" class="J-cover-img"><img class="rt3" src="images/cms/2f1501792cf9e5a2bc4d61ce5be7b93f.jpg" /></a></div>
							<h1 class="post-title"><a href="###">p3</a></h1>
						</article>
					</li>
					<li class="post">
						<article class="post-item J-item-cover r5">
							<div class="post-pic"><a href="###" class="J-cover-img"><img class="rt3" src="images/cms/8ba5ec8115fa8333cd79eba35038dd3b.jpg" /></a></div>
							<h1 class="post-title"><a href="###">p4</a></h1>
						</article>
					</li>
					<li class="post">
						<article class="post-item J-item-cover r5">
							<div class="post-pic"><a href="###" class="J-cover-img"><img class="rt3" src="images/cms/4ed8ef5d28ad631935b19a4f8615bcf7.jpg" /></a></div>
							<h1 class="post-title"><a href="###">p5</a></h1>
						</article>
					</li>
					<li class="post last">
						<article class="post-item J-item-cover r5">
							<div class="post-pic"><a href="###" class="J-cover-img"><img class="rt3" src="images/cms/5c5e68beee56738a2a20666a4f684fe6.jpg" /></a></div>
							<h1 class="post-title"><a href="###">p6</a></h1>
						</article>
					</li>
				</ul>
			</section>
		</div>
		<div class="home-item r5 clearfix">
			<section class="home-new-gift rl5 fl">
				<header class="home-new-gift-title">New</header>
				<div class="home-new-gift-detail"><a href="###"><img src="images/cms/99_conference.jpg"  width="287" height="135" /></a>
					<h3><a href="###">Personal Portfolio</a></h3>
					<p>Personal Portfolio Sites that sync with the Behance Network.Personal Portfolio Sites that sync with the Behance Network</p>
				</div >
				<footer class="home-footer-more"><a href="###" class="r3"><span class="ico-text">More</span><span class="ico-more"></span></a></footer>
			</section>
			<section class="home-wuxi-gift fl">
				<header class="home-wuxi-gift-title">Product<span class="home-header-more"><a href="###">More</a></span></header>
				<ul class="home-wuxi-gift-list clearfix">
					<li class="post">
						<article class="post-item J-item-cover r5">
							<div class="post-pic"><a href="###" class="J-cover-img"><img class="rt3" src="images/cms/99_book.jpg" /></a></div>
							<h1 class="post-title"><a href="###">p1</a></h1>
						</article>
					</li>
					<li class="post last">
						<article class="post-item J-item-cover r5">
							<div class="post-pic"><a href="###" class="J-cover-img"><img class="rt3" src="images/cms/99_conference.jpg" /></a></div>
							<h1 class="post-title"><a href="###">p2</a></h1>
						</article>
					</li>
				</ul>
			</section>
		</div>
		<div class="home-item r5 clearfix">
			<section class="home-school rl5 fl">
				<header class="home-school-title">New</header>
				<div class="home-school-detail"><a href="###"><img src="images/cms/99_conference.jpg"  width="287" height="135" /></a>
					<h3><a href="###">Personal Portfolio</a></h3>
					<p>Personal Portfolio Sites that sync with the Behance Network.Personal Portfolio Sites that sync with the Behance Network.</p>
				</div>
				<footer class="home-footer-more"><a href="###" class="r3"><span class="ico-text">More</span><span class="ico-more"></span></a></footer>
			</section>
			<section class="home-example fl">
				<header class="home-example-title">Example<span class="home-header-more"><a href="###">More</a></span></header>
				<div class="clearfix">
					<div class="home-example-pic fl mr10 r5">
						<div class=" pb10 clearfix"><a href="###" class="fl"><img class=" rlt3" src="images/cms/83a8cb1d7d3a7568ed9e54b33df752e1.jpg" width="133"  height="100" /></a><a href="###" class="fr" ><img class=" rrt3" src="images/cms/c7b8eea80a5f739b60a86277b2c10357.jpg" width="133"  height="100"/></a></div>
						<a href="###"><img  class="rb3" src="images/cms/99_book.jpg" width="277" height="135" /></a></div>
					<div class="home-example-detail fl"> Personal Portfolio Sites that sync with the Behance Network.Personal Portfolio Sites that sync with the Behance Network.Personal Portfolio Sites that sync with the Behance Network.Personal Portfolio Sites that sync with the Behance Network.Personal Portfolio Sites that sync with the Behance Network.Personal Portfolio Sites that sync with the Behance Network. </div>
				</div>
			</section>
		</div>
	</div>
</div>
<div class="footer-wrapper">
	<footer id="site-footer">
		<div class="site-call-center">
			<div class="phone-number">400-800-8000</div>
			<span class="phone-title">（客服电话）</span> </div>
		<nav class="site-map layout" role="navigation">
			<div class="clearfix">
				<dl class="fl quick-links clearfix">
					<dt>快速导航</dt>
					<dd><a href="###">网站地图</a></dd>
					<dd><a href="###">站点服务</a></dd>
					<dd><a href="###">关于我们</a></dd>
					<dd><a href="###">个性定制</a></dd>
					<dd><a href="###">联系我们</a></dd>
					<dd><a href="###">礼品策划</a></dd>
					<dd><a href="###">弘尚资讯</a></dd>
					<dd><a href="###">疑问解答</a></dd>
				</dl>
				<dl class="fr customer-example clearfix">
					<dt>客户案例</dt>
					<dd><a href="#">银行篇</a></dd>
					<dd><a href="#">政府篇</a></dd>
					<dd><a href="#">企业篇</a></dd>
				</dl>
			</div>
		</nav>
		<section class="footer-copyright"> Copyright  (C) 2003-2012 </section>
	</footer>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type='text/javascript' src='scripts/jquery.easing.1.3.js'></script>
<script type='text/javascript' src='scripts/jquery.hoverIntent.minified.js'></script>
<script type="text/javascript" src="scripts/diapo.js"></script>
<script type="text/javascript" src="scripts/common.js"></script>
</body>
</html>
